.px2rem(@name, @px){
	@{name}: @px / 75 *1rem;
}
.font-dpr(@font-size){
    font-size: @font-size;
    [data-dpr="2"] & {
        font-size: @font-size * 2;
    }
    [data-dpr="3"] & {
        font-size: @font-size * 3;
    }
}

	.header-j{
		z-index: 999;
		background-color: #fff;
		width: 100%;	
		position: fixed;
		top: 0;
		left:0;
		.px2rem(height,90);
		display: flex;
		justify-content: space-between;
		align-items: center;
		.left{
			width: 50%;
			text-align: left;
			.px2rem(font-size,52);
			padding: 0 5%;
		}
		.right{
			text-align: right;
			width: 50%;
			position: relative;
			top: 0;
			left:0;
			.iconfont{
				.px2rem(font-size,39);
				padding: 0 7%;
			}
			.i3{
				.px2rem(font-size,34);
			}
			span{
				display: inline-block;			
				.px2rem(font-size,15);
				.px2rem(width,36);
				&.shu1{
					position: absolute;
					top: 0;
					left:37%;
				}
				&.shu2{
					position: absolute;
					top: 0;
					left:67%;
				}
			}

		}
	}
	.show-j{
		.px2rem(margin-top,90);
			position: relative;
			top: 0;
			left:0;
		img{
			
			width: 100%;
		}
		.img27{
			position: absolute;
			bottom: -1%;
			left:10%;
			width: 46%;
		}
		.date{
			text-align: right;
			padding: 2% 4%;
			.px2rem(font-size,24);
			color: #303030;
		}
		.time{
			width: 20%;
			position: absolute;
			top: 11%;
			left:79%;
			div{
				.px2rem(font-size,27);
				padding: 0 4%;
				float: left;
				color: #fff;
			}
		}
	}
	.writing-j{
		 .px2rem(margin-bottom,98);
		color: #303030;
		.px2rem(font-size,29);
		.px2rem(height,500);
		display: flex;
		justify-content: center;
		align-items: center;
		.writing{
			.px2rem(line-height,50);
			.px2rem(width,600);
			position: relative;
			.Writer{
				position: absolute;
				bottom:-56%;
				right:8%;
			}
		}
	}


	.footer-j{
		z-index: 999;
		background-color: #fff;
		.px2rem(height,98);
		border-top: 1px solid #ccc;
		box-shadow: 0 0px 15px #ccc;
		position: fixed;
		bottom:0;
		left:0;
		width: 100%;
		display: flex;
		justify-content: space-around;
		align-items: center;

		.foot{
			width: 20%;
			text-align: center;
			a{
			text-decoration: none;
		}
			.iconfont{
				.px2rem(font-size,60);
				position: relative;
				top: 0;
				left:0;
			}
			.active{
				position: absolute;					
			}
			.hide{
				display: none;			
			}
			.homepage{
				top: 17%;
				left:6%;
			}
			.discover{
				top: 17%;
				left:27%;
			}
			.add{
				top: 17%;
				left:46.5%;
			}
			.warn{
				top: 17%;
				left:66.5%;
			}
			.user{
				top: 17%;
				left:86%;
			}
		}
	}

